<template>

<table class="table table-bordered">

    <thead>
        <tr>
            <th>房号id</th>
            <th>房号名称</th>
            <th>排序</th>
            <th>备注</th>
            <th>状态</th>
            <th>操作</th>
        </tr>

    </thead>


        <tbody v-for="item in Show1">
            <tr>
            <th>{{ item.hid }}</th>
            <th>{{ item.hname }}</th>
            <th>{{ item.paiXu }}</th>
            <th>{{ item.beiZhu }}</th>
            <th>{{ item.state?"上架":"下架"}}</th>
            <th><button @click="IsDel(item.hid)">删除</button>
                    <button v-show="item.state==true"  @click="Upstate(item.hid)">下架</button>
                    <button v-show="item.state==false" @click="Upstate(item.hid)">上架</button>
            
            
            </th>
        </tr>


        </tbody>
</table>






</template>


<script setup lang="ts">

    




import { onMounted, ref } from 'vue';

import axios from 'axios';
onMounted(()=>{

    show();
})



const Show1=ref([{



    "hid": 0,
    "hname": "string",
    "paiXu": 0,
    "beiZhu": "string",
    "state": true,
    "isDel": true
}])


const show =()=>{

    axios.get('https://localhost:7039/api/User/ShowFangHao').then(res=>{

        Show1.value=res.data;
    })
}


const IsDel =(id:number)=>{

if(!confirm('确定删除吗'))
{
    return ;
}

axios.delete('https://localhost:7039/api/User/IsDelete',{params:{
    id:id,
}}).then(res=>{

    if(res.data>0)
{
    alert('删除成功')
    show();
}
else
{
    alert('删除失败')
}
})


}




const Upstate=(id:number)=>{


        axios.get('https://localhost:7039/api/User/UpState',{params:{


            id:id
        }}).then(res=>{

                if(res.data>0)
                {
                    alert('修改成功')
                    show();
                }
                else
                {
                    alert('修改失败')
                }
        })
}





</script>